<script setup>
import {isNull} from "@/utils/validate.js";

const props = defineProps({
  status: {
    type: String,
  },
  statusSteps: {
    type: Array
  }
})
const stepsActive = ref(0)
watchEffect(() => {
  if (!isNull(props.statusSteps)) {
    for (let i = 0; i < props.statusSteps.length; i++) {
      let status = props.statusSteps[i].value
      if (status === props.status) {
        stepsActive.value = i
        break
      }
    }
  }
})

</script>

<template>
  <el-steps :active="stepsActive" align-center>
    <el-step v-for="item in statusSteps" :key="item.value" :title="item.label">
    </el-step>
  </el-steps>
</template>